<?php
require 'header.php';
require 'authorisation.php';
require 'DAO.php';
?>
<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="utf-8" />
		<!-- Always force latest IE rendering engine (even in intranet) & Chrome Frame
		Remove this if you use the .htaccess -->
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
		<title>index</title>
		<meta name="description" content="" />
		<meta name="author" content="Léon" />
		<meta name="viewport" content="width=device-width; initial-scale=1.0" />
		<style>
			.box {
				border: solid 1px #c9c9c9;
				background-color: rgba(220, 220, 220, 0.4);
				box-shadow: 0px 1px 8px rgba(0, 0, 0, 0.90);
				-moz-box-shadow: 0px 1px 8px rgba(0, 0, 0, 0.90);
				-webkit-box-shadow: 0px 1px 8px rgba(0, 0, 0, 0.90);
				float: left;
				margin: 10px;
				margin-top: 2px;
				padding: 10px;
			}
			
			@font-face {
				font-family: russischFont;
				src: url('uploads/DINARJEVREPUBLIKA_0.TTF');
			}
			h1 {
				font-family: russischFont;
				font-size: 20px;
				color: green;
				padding: 0px;
				text-align: center;
			}
			#main {
				width: 480px;
				min-height: 380px;
				padding: 20px;
			}

			.globalNav {
				width: 240px;
				padding: 5px;
				margin: 10px;
				float: left;
				border: solid 1px #c9c9c9;
				background-color: rgba(220, 220, 220, 0.4);
				box-shadow: 0px 1px 8px rgba(0, 0, 0, 0.90);
				-moz-box-shadow: 0px 1px 8px rgba(0, 0, 0, 0.90);
				-webkit-box-shadow: 0px 1px 8px rgba(0, 0, 0, 0.90);
			}

			.globalNav:hover {
				box-shadow: inset 0px 1px 8px rgba(0, 0, 0, 0.90);
				-moz-box-shadow: inset 0px 1px 8px rgba(0, 0, 0, 0.90);
				-webkit-box-shadow: inset 0px 1px 8px rgba(0, 0, 0, 0.90);
			}

			.globalNavSelected {
				border: solid 1px #c9c9c9;
				background-color: rgba(220, 220, 220, 0.4);
				float: left;
				width: 240px;
				margin: 10px;
				padding: 5px;
				box-shadow: inset 0px 1px 8px rgba(0, 0, 0, 0.90);
				-moz-box-shadow: inset 0px 1px 8px rgba(0, 0, 0, 0.90);
				-webkit-box-shadow: inset 0px 1px 8px rgba(0, 0, 0, 0.90);
			}

			.announcement {
				width: 500px;
			}
			.announcement * {
				max-width: 480px;
			}
			
			.knop {
				border: solid 2px green;
				font-family: Myriad Pro;
				font-size: 14px;
				color: white;
				border-radius: 6px;
				background-image: linear-gradient(bottom, rgb(28,189,0) 7%, rgb(26,128,10) 52%);
				background-image: -o-linear-gradient(bottom, rgb(28,189,0) 7%, rgb(26,128,10) 52%);
				background-image: -moz-linear-gradient(bottom, rgb(28,189,0) 7%, rgb(26,128,10) 52%);
				background-image: -webkit-linear-gradient(bottom, rgb(28,189,0) 7%, rgb(26,128,10) 52%);
				background-image: -ms-linear-gradient(bottom, rgb(28,189,0) 7%, rgb(26,128,10) 52%);
				box-shadow: -4px -4px 6px rgba(0, 0, 0, 0.30) inset;
				-moz-box-shadow: -4px -4px 6px rgba(0, 0, 0, 0.30) inset;
				-webkit-box-shadow: -4px -4px 6px rgba(0, 0, 0, 0.30) inset;
			}
			.knop:hover {
				border: solid 2px green;
				font-family: Myriad Pro;
				font-size: 14px;
				color: white;
				border-radius: 6px;
				background-image: linear-gradient(bottom, rgb(28,189,0) 7%, rgb(26,128,10) 52%);
				background-image: -o-linear-gradient(bottom, rgb(28,189,0) 7%, rgb(26,128,10) 52%);
				background-image: -moz-linear-gradient(bottom, rgb(28,189,0) 7%, rgb(26,128,10) 52%);
				background-image: -webkit-linear-gradient(bottom, rgb(28,189,0) 7%, rgb(26,128,10) 52%);
				background-image: -ms-linear-gradient(bottom, rgb(28,189,0) 7%, rgb(26,128,10) 52%);
				box-shadow: 4px 4px 6px rgba(0, 0, 0, 0.30) inset;
				-moz-box-shadow: 4px 4px 6px rgba(0, 0, 0, 0.30) inset;
				-webkit-box-shadow: 4px 4px 6px rgba(0, 0, 0, 0.30) inset;
			}
			
			#announceKnop {
				font-family: russischFont;
				font-size: 20px;
				text-align: center;
				width: 480px;
				height: 10px;
				padding: 20px;
				padding-top: 5px;
				float: left;
				margin: 10px;
				margin-top: 2px;
				
			}

			#feedBox {
				border: solid 1px #959595;
				background-color: #c9c9c9;
				width: 220px;
				height: 400px;
				font-size: 15px;
				position: fixed;
				top: 175px;
				margin-left: 550px;
			}
			#feed {
				overflow: auto;
				height: 250px;
				position: relative;
				top: -180px;
			}
			::-webkit-scrollbar {
				width: 6px;
			}
			::-webkit-scrollbar-thumb {
				background: white;
				border-radius: 4px;
				-webkit-box-shadow: inset -1px 1px 3px rgba(0,0,0,0.5);
			}
			#topfeed {
				width: 160px;
				position: relative;
				top: -10px;
				left: -5px;
				z-index: 10;
			}
			#footer {
				width: 500px;
				font-size: 12px;
			}
			#hrFeed {
				position: relative;
				top: -180px;
			}
			#message {
				border: none;
				font-family: "Myriad Pro", "Verdana";
				font-size: 15px;
				background-color: white;
				width: 206px;
				height: 3em;
				resize: none;
				outline: none;
				overflow: visible;
				color: grey;
				padding: 5px;
				position: relative;
				top: -180px;
				box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.30) inset;
				-moz-box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.30) inset;
				-webkit-box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.30) inset;
			}
			#editprompt {
				border: none;
				font-family: "Myriad Pro", "Verdana";
				background-color: white;
				width: 464px;
				height: 340px;
				resize: none;
				outline: none;
				overflow: visible;
				padding: 5px;
				box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.30) inset;
				-moz-box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.30) inset;
				-webkit-box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.30) inset;
			}
			body {
				font-family: "Myriad Pro", "Verdana";
				font-size: 16px;
				width: 800px;
				margin-left: auto;
				margin-right: auto;
			}
			hr {
				color: green;
				background-color: green;
				height: 4px;
				border: none;
			}
			#maincontent {
				min-height: 360px;
				word-wrap: break-word;
			}
			#edit, #dump {
				float: right;
			}
		</style>
		<script type="text/javascript" src="ajax.js"></script>
		<script type="text/javascript" src="jquery.js"></script>
		<script type="text/javascript">
			/*******************:****************************
			 * Textarea Maxlength script- © Dynamic Drive (www.dynamicdrive.com)
			 * This notice must stay intact for legal use.
			 * Visit http://www.dynamicdrive.com/ for full source code
			 ***********************************************/
<?php
$con = new connection();
$highlight = $con -> getHighlight();
?>
	function ismaxlength(obj) {
		var mlength = obj.getAttribute ? parseInt(obj.getAttribute("maxlength")) : ""
		if (obj.getAttribute && obj.value.length > mlength)
			obj.value = obj.value.substring(0, mlength)
	}
		</script>
	</head>
	<body>
		<div id="banner">
			<img src="uploads/Header.png" alt="FUCKING ZAZOU">
		</div>
		<div class="globalNav" id="linkNaarHome">
			<h1>Hoek</h1>
		</div>
		<div class="globalNav" id="linkNaarBlog">
			<h1>Naar blog</h1>
		</div>
		<div id="content">
			<div class="box" id="main">
				<div id="maincontent">
					<?php
					$con = new connection();
					$highlight = $con -> getHighlight();
					echo $highlight;
					?>
				</div>
				<?php
				if ($clearance == "admin") {
					echo "<input type='submit' value='edit' class='knop' id='edit'></input>";
				}
				?>
			</div>
		</div>
		<div class="box" id="feedBox">
			<h1>LIVE FEED MUTHAFUCKA</h1>
			<div id="topfeed">
				<img src="uploads/topfeed.png"/>
			</div>
			<div id="feed">
				>>getting feed<<
			</div>
			<hr id="hrFeed" />
			<textarea maxlength="78" onkeyup="return ismaxlength(this)" id="message">Type hier je bericht madfakaa</textarea>
		</div>
		<div id="footer" class="box">
			&copy; Copyright  by Léon de Zwart and Casper Jonker
		</div>
	</body>
	<script type="text/javascript">
		var myReq = getAjax();
		$('#linkNaarHome').addClass('globalNavSelected');
		getFeed();
		window.onload = function() {
			var t = document.getElementById("feed");
			t.scrollTop = t.scrollHeight;
		}
		/* Feed dumper onclick en post bam */
		document.onkeypress = processKey;
		var focus = false;
		elem = document.getElementById("message");

		elem.onfocus = function() {
			focus = true;
			$('#message').css("color", "black");
			if (elem.value == "Type hier je bericht madfakaa") {
				elem.value = "";
			}
		};
		elem.onblur = function() {
			if (elem.value == "") {
				$('#message').css("color", "grey");
				elem.value = "Type hier je bericht madfakaa";
			}
			focus = false;
		};
		function processKey(e) {
			if (null == e)
				e = window.event;
			if (e.keyCode == 13 && focus) {
				sendReply(document.getElementById('message').value);
				document.getElementById('message').value = "";
				return false;
			}
		}
		<?php echo 'var highlight = "'.$highlight.'";'
		?>
					highlight = highlight.replace("/<br />/g","\n");
		document.getElementById('topfeed').ondragstart = function() {
		return false;
		};
		

		function loadHome() {
			$('#linkNaarHome').addClass('globalNavSelected');
					$('#linkNaarBlog').removeClass('globalNavSelected');
		document.getElementById('content').innerHTML =
		'<div class="box" id="main"><div id="maincontent">'+highlight+"</div>"+"<?php
		if ($clearance == "admin") {
			echo "<input type='submit' value='edit' class='knop' id='edit'></input>";
			
		}
		?>"+"</div></div>";
		$('#edit').click(function() {
		var txt = "<form method='post' action='postPage.php'><textarea name='editprompt' id='editprompt'>" + highlight + "</textarea>" + "<input type='submit' value='dump' class='knop' id='dump'></input></form>";
		document.getElementById('main').innerHTML = txt;
		});
		document.getElementById('topfeed').ondragstart = function() {
		return false;
		};
		}
		
		function loadBlog() {
					getNews();	
		}
		
			$('#linkNaarBlog').click(loadBlog);
		$('#linkNaarHome').click(loadHome);
		$('#banner').click(loadHome);
		
		$('#edit').click(function() {
		var txt = "<form method='post' action='postPage.php'><textarea name='editprompt' id='editprompt'>" + highlight + "</textarea>" + "<input type='submit' value='dump' class='knop' id='dump'></input></form>";
		document.getElementById('main').innerHTML = txt;
		});
		document.getElementById('topfeed').ondragstart = function() {
		return false;
		};
	</script>
</html>
